<template>
  <el-row class="gradeRow">
    <el-col class="basicItem" :span="4">{{item.cno}}</el-col>
    <el-col class="basicItem" :span="4">{{item.cname}}</el-col>
    <el-col class="basicItem" :span="4">{{item.credit * 16}}</el-col>
    <el-col class="basicItem" :span="4">{{item.credit}}</el-col>
    <el-col class="basicItem grade" :span="4">{{item.score}}</el-col>
    <el-col class="basicItem gpa" :span="4">{{item.GPA}}</el-col>
  </el-row>
</template>

<script lang="ts">
export default {
  name: 'gradeItem',
  props: {
    item: Object
  },
  setup () {
    return {}
  }
}
</script>

<style lang="scss" scoped>
@import "../../../assets/Fonts/FontMap/FontMap";
@import "../../../assets/Fonts/FontMap/FontList.css";
.gradeRow{
  height: 40px;
  width: 100%;
  .basicItem{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: $SH_Serif_Regular;
  }
  .grade{
    font-family: $Mi_Lan;
    font-weight: bold;
    color: green;
  }
  .gpa{
     font-family: $Mi_Lan;
     font-weight: bold;
     color: #409EFF;
   }
}
</style>
